var content = `
<!DOCTYPE html>
<html>
<head>
  <style>
    html, body {
      height: 100%;
      margin: 0;
      overflow: hidden;
      width: 100%;
    }
  </style>
  <link href="//s0.meituan.net/bs/css?f=delivr:datum/graphiql.css@7703fe" rel="stylesheet" />
  <script src="//s0.meituan.net/bs/js?f=delivr:datum/fetch.min.js@7703fe"></script>
  <script src="//s1.meituan.net/bs/js?f=delivr:datum/react.min.js@7703fe"></script>
  <script src="//s1.meituan.net/bs/js?f=delivr:datum/react-dom.min.js@7703fe"></script>
  <script src="//s1.meituan.net/bs/js?f=delivr:datum/graphiql.min.js@7703fe"></script>
</head>
<body>
<script>
// Collect the URL parameters
var parameters = {};
window.location.search.substr(1).split('&').forEach(function (entry) {
  var eq = entry.indexOf('=');
  if (eq >= 0) {
    parameters[decodeURIComponent(entry.slice(0, eq))] =
      decodeURIComponent(entry.slice(eq + 1));
  }
});

// Produce a Location query string from a parameter object.
function locationQuery(params) {
  return '/graphql?' + Object.keys(params).map(function (key) {
    return encodeURIComponent(key) + '=' +
      encodeURIComponent(params[key]);
  }).join('&');
}

// Derive a fetch URL from the current URL, sans the GraphQL parameters.
var graphqlParamNames = {
  query: true,
  variables: true,
  operationName: true
};

var otherParams = {};
for (var k in parameters) {
  if (parameters.hasOwnProperty(k) && graphqlParamNames[k] !== true) {
    otherParams[k] = parameters[k];
  }
}
var fetchURL = locationQuery(otherParams);

// Defines a GraphQL fetcher using the fetch API.
function graphQLFetcher(graphQLParams) {
  var m = fetchURL[fetchURL.length - 1] === '?' ? '' : '&';
  var url = fetchURL + m + "__datummock=" + (window.isMock ? '1' : '0');
  return fetch(url, {
    method: 'post',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(graphQLParams),
    credentials: 'include',
  }).then(function (response) {
    return response.text();
  }).then(function (responseBody) {
    try {
      return JSON.parse(responseBody);
    } catch (error) {
      return responseBody;
    }
  });

}

// When the query and variables string is edited, update the URL bar so
// that it can be easily shared.
function onEditQuery(newQuery) {
  parameters.query = newQuery;
  window.graphqlQueryString = newQuery;
  updateURL();
}

function onEditVariables(newVariables) {
  parameters.variables = newVariables;
  updateURL();
}

function onEditOperationName(newOperationName) {
  parameters.operationName = newOperationName;
  updateURL();
}


function updateURL() {
  history.replaceState(null, null, locationQuery(parameters));
}

// Render <GraphiQL /> into the body.
window.G = React.render(
  React.createElement(GraphiQL, {
    fetcher: graphQLFetcher,
    onEditQuery: onEditQuery,
    onEditVariables: onEditVariables,
    onEditOperationName: onEditOperationName,
    query: null,
    response: null,
    variables: null,
    operationName: null,
  }),
  document.body,
  function () {
  }
);
</script>
</body>
</html>


`;
module.exports = content;
